// index.js
// 首页对应的js文件

// 读取cookie里的petname
// $.cookie()是jquery.cookie.js的一个方法
var petname = $.cookie('petname')
console.log(petname)
if(petname){
    $('#user').find('span').last().text(petname)
}

// 用户点击"提问"
$('#ask').click(function(){
    if(petname){
        location.href = 'ask.html'
    }else location.href = 'signin.html'
})

// 用户点击"退出"
$('.navbar .dropdown-menu li').last().click(function(){
    $.get('/user/signout', null, function(res){
        if(res.code == 'success'){
            location.href = '/'
        }
    })
})

// 用户点击"问题"时跳转到"回答"页面
// 给每个"问题"绑定单击事件
// delegate()会监听.questions的子元素
$('.questions').delegate('[question]', 'click', function(){
    if(petname){
        // 读取每个"问题"的question的值
        // 然后再写入cookie中
        $.cookie('question', $(this).attr('question'))
        location.href = 'answer.html'
    }else location.href = 'signin.html'
})


// 显示"问题"和"答案"
$.get('/questions', null, function(res){
    var html = ''
    console.log(res)
    for(var i = 0; i < res.data.length; i++){
        var q = res.data[i]
        html += '<div class="media" question="' + new Date(q.time).getTime() + '">'
        html += '<div class="media-left">'
        html += '<a>'
        html += '<img class="media-object" src="uploads/' + q.petname + '.jpg" onerror="this.src=\'images/user.png\'">'
        html += '</a>'
        html += '</div>'
        html += '<div class="media-body">'
        html += '<h4 class="media-heading">' + q.petname + '</h4>'
        html += q.content
        html += '<div class="media-footing">'
        html += q.time
        html += '</div>'
        html += '</div>'
        html += '</div>' 
        // 如果有"答案"继续拼接
        if(q.answers){
            for(var j = 0; j < q.answers.length; j++){
                var a = q.answers[j]
                html += '<div class="media media-child">'
                html += '<div class="media-body">'
                html += '<h4 class="media-heading">' + a.petname + '</h4>'
                html += a.content
                html += '<div class="media-footing">'
                html += a.time
                html += '</div>'
                html += '</div>'
                html += '<div class="media-right">'
                html += '<a>'
                html += '<img class="media-object" src="uploads/' + a.petname + '.jpg" onerror="this.src=\'images/user.png\'">'
                html += '</a>'
                html += '</div>'
                html += '</div>'
            }
        }
    }
    $('article').html(html)
})